<template>
  <HerinContainer
    class="MainCoal-box"
    :delay="1"
    direction="Left"
    title="掘进机截割分析"
  >
    <!-- 内容区 -->
    <div slot="content" class="MainCoal-box-content">
      <MouldBoxV4Vue :datas="datas" :color="['#34C8FF','#00FDFF']" :text="['割顶','割底']"></MouldBoxV4Vue>
    </div>
  </HerinContainer>
</template>

<script>
import HerinContainer from '@/components/HerinContainer';
import MouldBoxV4Vue from '../common/MouldBoxV4.vue';
import { lineInfo } from '../common/titles';
export default {
  components: {
    HerinContainer,
    MouldBoxV4Vue
  },
  data() {
    return {
      lineInfo: {}
    };
  },
  computed: {
    routeId() {
      return this.$route.params.id;
    },
    datas() {
      const info = this.lineInfo[this.routeId];
      if (info) {
        const data1 = info.list1.map(item => {
          return {
            x: item.key,
            y: Number(item.value),
            s: '割顶'
          };
        });
        const data2 = info.list2.map(item => {
          return {
            x: item.key,
            y: Number(item.value) + 10,
            s: '割底'
          };
        });
        return [...data1, ...data2];
      } else {
        return [];
      }
    }
  },
  // 初始赋值
  mounted() {
    this.lineInfo = lineInfo;
  },
  methods: {
    clickTitleTab(item) {
      this.isbtn = item;
    }
  }
};
</script>

<style lang='scss' scoped>
.MainCoal-box {
  height: 15.6875rem;
}
</style>
